﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="AboutMe.aspx.cs" Inherits="Omabar.CMS.Pages.AboutMe" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <!--Title-->
    <title>欧玛贝&mdash;&mdash;来自德国，专注定制</title>
    <link href="css/basic_aboutMe.css" rel="stylesheet" type="text/css" />
    <link href="css/index.css" type="text/css" rel="stylesheet" />
    <link href="css/GoTop.css" rel="stylesheet" type="text/css" />
    <link href="css/ContentPage.css" rel="stylesheet" type="text/css" />
    <link href="css/menuList.css" rel="stylesheet" type="text/css" />
    <link href="css/turnPage.css" rel="stylesheet" type="text/css" />
    <link href="css/kkpager_orange.css" rel="stylesheet" type="text/css" />

    <!--Required libraries-->
    <script src="js/min/jquery-v1.10.2.min.js" type="text/javascript"></script>
    <script src="js/kkpager.min.js" type="text/javascript"></script>
    <script src="js/GoTop.js" type="text/javascript"></script>
    <script src="js/common.js" type="text/javascript"></script>
    <script type="text/javascript">
        function GetQueryString(name) {
            var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
            var r = window.location.search.substr(1).match(reg);
            if (r != null) return unescape(r[2]); return null;
        }

        var _currentRoutesResult;   //当前得到的查询结果
        initPageSelecter = function () {
            $("#kkpager").html();
            

            kkpager.generPageHtml({
                //当前页码
                pno: 1,
                //总页码
                total: (_currentRoutesResult.length / 5) + 1,
                //总数据条数
                totalRecords: _currentRoutesResult.length,
                mode: 'click',
                click: function (n) {
                    this.selectPage(n);

                    var innerHTML = "";
                    var minIndex = (n - 1) * 5 ;
                    var maxIndex = n * 5;
                    
                    $.each(_currentRoutesResult, function (idx, route) {
                        //debugger;
                        if (idx > minIndex -1) {
                            if (idx > maxIndex-1) return;
                            innerHTML += "<div class=\"theList\">";
                            innerHTML += "        <div class=\"listContent\">";
                            innerHTML += "            <div class=\"listPic floatL\">";
                            innerHTML += "                <img src=\"" + route.Cover + "\" width=\"300\" height=\"250\" alt=\"\" />";
                            innerHTML += "            </div>";
                            innerHTML += "            <div class=\"listText floatR\">";
                            innerHTML += "                <ul>";
                            innerHTML += "                    <li class=\"h22\">" + route.ROUTE_NAME + "</li>";
                            innerHTML += "                    <li class=\"h4 fontcolb9 lineh20 marginT20 marginB40\">" + route.ROUTE_DES + "<br />";
                            innerHTML += "                        旅行主题：" + route.ThemeString + "<br />";
                            //innerHTML += "                        出发日期：" + route.ROUTE_DATE_START_SHORT + "/" + route.ROUTE_DATE_END_SHORT + "...</li>";
                            innerHTML += "                        途经城市：" + route.Citys + "</li>";
                            innerHTML += "                    <li class=\"h4 fontcolb9 lineh20 noDisplay\">" + route.ROUTE_BAK + "</li>";
                            innerHTML += "                    <li class=\"fontcolfc3\">";
                            innerHTML += "                        <div class=\"floatL noDisplay\"><span class=\"h1\">" + route.ROUTE_PRICE + "</span>RMB/人起</div>";
                            innerHTML += "                        <div class=\"floatR\">";
                            innerHTML += "                            <a href=\"" + route.ROUTE_ID + ".html\">";
                            innerHTML += "                                <img src=\"images/linkDdetails.png\" width=\"126\" height=\"27\" alt=\"\" /></a>";
                            innerHTML += "                        </div>";
                            innerHTML += "                    </li>";
                            innerHTML += "                </ul>";
                            innerHTML += "            </div>";
                            innerHTML += "        </div>";
                            innerHTML += "    </div>";
                            innerHTML += "  <div class=\"clear\"></div>";
                        }
                    });
                    $("#routeList").html(innerHTML);
                    currentPage = n;

                    return false;
                },
                lang: {
                    firstPageText: '<<',
                    lastPageText: '>>',
                    prePageText: '<',
                    nextPageText: '>',
                }
            });
        }
        $(document).ready(function () {
            $("#firstpane p.menu_head").css({ "background-color": "#99cccc" });
            
            $("#firstpane p.menu_head").click(function () {
                $(this).css({ background: "#33cccc" }).next("div.menu_body").slideToggle(300).siblings("div.menu_body").slideUp("slow");
                $(this).siblings().css({ "background-color": "#99cccc" });
                $("#menu_body").css({ "background-color": "#ffffff" });
                if ($(this).attr("data-key")) {
                    getRoutesByFilter($(this).attr("data-key"), $(this).attr("data-value"), initPageSelecter)
                }
            });
            $("#firstpane p.menu_head").mouseover(function () {
                $(this).css({ background: "#33cccc" });
                $(this).siblings().css({ "background-color": "#99cccc" });
                $("#menu_body").css({ "background-color": "#ffffff" });
            });

            $(".listHead .newsSorting a").click(function () {
                sortField = $(this).attr("data-key");
                sortType = $(this).attr("data-type");
                if (sortType == "asc")
                    $(this).attr("data-type", "desc");
                else
                    $(this).attr("data-type", "asc");

                getRoutesByFilter(filter.key, filter.val, initPageSelecter);
            });


            //定位搜索项
            var w_queryType = GetQueryString("type");
            switch (w_queryType)
            {
                case "p_themes":
                    $("#" + w_queryType).css({ background: "#33cccc" }).next("div.menu_body").slideToggle(300).siblings("div.menu_body").slideUp("slow");
                    $(this).siblings().css({ "background-color": "#99cccc" });
                    $("#menu_body").css({ "background-color": "#ffffff" });
                    break;
                case "p_countrys":
                    $("#" + w_queryType).css({ background: "#33cccc" }).next("div.menu_body").slideToggle(300).siblings("div.menu_body").slideUp("slow");
                    $(this).siblings().css({ "background-color": "#99cccc" });
                    $("#menu_body").css({ "background-color": "#ffffff" });
                    if ($("#" + w_queryType).attr("data-key")) {
                        getRoutesByFilter($("#" + w_queryType).attr("data-key"), $("#" + w_queryType).attr("data-value"), initPageSelecter)
                    }
                    break;
                case "p_elaborate":
                    $("#" + w_queryType).css({ background: "#33cccc" }).next("div.menu_body").slideToggle(300).siblings("div.menu_body").slideUp("slow");
                    $(this).siblings().css({ "background-color": "#99cccc" });
                    $("#menu_body").css({ "background-color": "#ffffff" });
                    if ($("#" + w_queryType).attr("data-key")) {
                        getRoutesByFilter($("#" + w_queryType).attr("data-key"), $("#" + w_queryType).attr("data-value"), initPageSelecter)
                    }
                    break;
            }

            getRoutesByFilter(null, null, initPageSelecter);

           
        });
        function changeImg_(flag) {
            $("#aboutMe_img")[0].src = "images/"+flag+".png";
        }
    </script>
</head>
<body class="bodyBg">
    <div id="top"></div>
    <!--顶部-->
    <div class="PlacedTop">
    <div class="ContentPageTop" id="ContentPageTop">
        <div class="ContentPageLogo">
            <ul>
               <%-- <li><a href="#">注册</a></li>
                <li>|</li>
                <li><a href="#">登录</a></li>--%>
                <li><a href="#" onmouseover="document.getElementById('QrCodeWeChat').style.display='block'" onmouseout="document.getElementById('QrCodeWeChat').style.display='none'">
                    <img src="images/iconWeChat.png" width="22" height="18" alt="" align="absmiddle" /></a></li>
                <li><a href="#" onmouseover="document.getElementById('QrCodeWeibo').style.display='block'" onmouseout="document.getElementById('QrCodeWeibo').style.display='none'">
                    <img src="images/iconWeibo.png" width="22" height="18" alt="" align="absmiddle" /></a></li>
            </ul>
            <div id="QrCodeWeChat">
                <img src="images/QrCodeWeChat.jpg" width="86" height="86" alt="" />
            </div>
            <div id="QrCodeWeibo">
                <img src="images/pic-11.jpg" width="86" height="86" alt="" />
            </div>
        </div>
    </div>

    <!--导航栏-->
    <div class="ContentPageNav">
        <div class="ContentPageContainer">
            <div class="Search">
                <input type="text" class="SearchInput" />
            </div>
            <div class="ContentNav">
                <ul>
                    <li><a href="Index.aspx" class="oneNavLink01"></a></li>
                    <li><a href="RouteList.aspx" class="oneNavLink02current"></a></li>
                    <li><a href="CustomizedTrip.aspx" class="oneNavLink03"></a></li>
                    <li><a href="#" class="oneNavLink04"></a></li>
                    <li><a href="#" class="oneNavLink05"></a></li>
                </ul>
            </div>
        </div>
    </div>
    </div>
    <div class="clear"></div>

    <!--主体内容-->
    <div class="container02 paddingT10 marginT200">
        <div class="ContentPageContainer">
            <!--菜单-->
            <div id="firstpane" class="menu_list">
                <!--Code for menu starts here-->
                <p class="menu_head" style="height:70px; line-height:30px;  padding-top:12px;padding-left:70px;"><img src="images/bg_aboutme_fly.png" style="position:absolute; left:30px; top:30px;" /><span>关于欧玛贝</span><br /><span>品牌理念、服务理念等</span></p>
                <div id="menu_body" class="menu_body" >
                    <a href="#" onclick="changeImg_('bg_aboutme_pinpaililian');" ><span>我们的品牌理念</span></a>
                    <hr style="color:#33cccc;" />
                    <a href="#" onclick="changeImg_('bg_aboutme_fuwu');" ><span>我们的服务理念</span></a>
                    <hr style="color:#33cccc;" />
                    <a href="#" onclick="changeImg_('bg_aboutme_zusu');" ><span>我们的住宿</span></a>
                    <hr style="color:#33cccc;" />
                    <a href="#" onclick="changeImg_('bg_aboutme_meishi');" ><span>我们的美食</span></a>
                    <hr style="color:#33cccc;" />
                    <a href="#" onclick="changeImg_('bg_aboutme_jiaotong');" ><span>我们的交通</span></a>
                    <hr style="color:#33cccc;" />
                    <a href="#" onclick="changeImg_('bg_aboutme_shilv');" ><span>我们的私旅管家</span></a>
                    <hr style="color:#33cccc;" />
                    <a href="#" onclick="changeImg_('bg_aboutme_pinpai');" ><span>我们的品牌</span></a>
                    <hr style="color:#33cccc;" />
                    <a href="#" onclick="changeImg_('bg_aboutme_maidian');" ><span>我们的卖点</span></a>
                </div>

<p class="menu_head" style="height:70px; line-height:30px;  padding-top:12px;padding-left:70px;" id="p_countrys"><img src="images/bg_aboutme_news.png" style="position:absolute; left:30px; top:30px;" /><span>新闻资讯</span><br /><span>最新海外游资讯动态</span></p>    
                <p class="menu_head" style="height:70px; line-height:30px;  padding-top:12px;padding-left:70px;" id="p_themes"  onclick="changeImg_('bg_aboutme_lianxi');" ><img src="images/bg_aboutme_contact.png" style="position:absolute; left:30px; top:30px;" /><span>联系欧玛贝</span><br /><span>联系团队</span></p>            
            </div>

            <!--内容显示-->
            <div class="rightContent">
                <img id="aboutMe_img" width="660" height="760" src="images/bg_aboutme_lianxi.png" />
                <div style="display:none;" id="kkpager"></div>
            </div>
        </div>
    </div>
    <div class="clear"></div>

    <!--内容区域返回顶部按钮-->
    <div class="semicircleBackTop"><a href="#ContentPageTop"></a></div>
    <div class="clear"></div>

    <!--底部链接-->
    <div class="bottom">
        <div class="bottomText">
            <div class="contactUs floatL">
                <ul>
                    <li class="marginB10">联系我们</li>
                    <li class="marginB10 fontfa fontW">400-007-0819</li>
                    <li class="marginB10 fontCol666 h4">info@omabar.cn</li>
                    <li class="paddingT20">
                        <img src="images/logoBottom.png" width="169" height="19" alt="" /></li>
                    <li class="fontCol666 h5">欢迎来到欧玛贝，快来<span class="fontcolfc3 font16">注册</span>吧！<br />
                        切换到手机版浏览</li>
                </ul>
            </div>
            <div class="WeChat floatL">
                <ul>
                    <li class="marginB10">欧玛贝微信开通</li>
                    <li class="marginB10 fontcolfc3 font16">订阅号</li>
                    <li class="marginB10 fontCol666 h5">专注欧美旅行定制服务<br>
                        账号：欧玛贝旅游</li>
                    <li class="marginB10">欧玛贝微博开通</li>
                    <li class="marginB10 fontCol666 h5">专注欧美旅行定制服务<br>
                        账号：欧玛贝旅游</li>
                </ul>
            </div>
            <div class="bottomLink floatL">
                <ul>
                    <li class="marginB10">关于欧玛贝</li>
                    <li class="marginB10"><a href="#">关于我们</a></li>
                    <li class="marginB10"><a href="#">团队</a></li>
                    <li class="marginB10"><a href="#">媒体报道</a></li>
                    <li class="marginB10"><a href="#">工作机会</a></li>
                </ul>
            </div>
            <div class="bottomLink floatL">
                <ul>
                    <li class="marginB10">技术支持</li>
                    <li class="marginB10"><a href="#">隐私政策</a></li>
                    <li class="marginB10"><a href="#">服务条款</a></li>
                    <li class="marginB10"><a href="#">联系我们</a></li>
                    <li class="marginB10"><a href="#">合作伙伴</a></li>
                </ul>
            </div>
        </div>
    </div>
    <div class="clear"></div>

    <!--版权所有-->
    <div class="copyright">Copyright OMABAR欧玛贝 2015 | 渝ICP备</div>
    <div class="clear"></div>
</body>
</html>
